<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Mechvibes</title>
    <meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline';" />
    <link rel="shortcut icon" type="image/png" href="./assets/icon.png" />
    <link rel="stylesheet" href="./assets/milligram.min.css" />
    <link rel="stylesheet" href="./assets/app.css" />
  </head>

  <body style="padding: 2rem">
    <div id="app-logo">
      <div id="logo">Mechvibes</div>
    </div>

    <div id="app-body">
      <table style="display: table">
        <tbody>
          <tr class="checkbox-group" id="remote_toggle_group">
            <td style="width: 75%">
              <div>Enable Remote Debugging</div>
              <div style="opacity:0.7;font-size:0.8em;line-height:1;">Please do not enable this feature unless you've been asked to.</div>
            </td>
            <td style="width: 25%">
              <div style="display:grid;grid-template-columns: 1em auto;font-size: 2rem;justify-content:right;">
                <input type="checkbox" class="checkbox mb-0" id="remote_toggle"/>
              </div>
            </td>
          </tr>
        </tbody>
      </table>
      <div class="divider"></div>
      <div id="remote_options">
        <div class="input-group">
          <div>Debug Code</div>
          <input type="text" readonly id="debug_code" placeholder="You don't have a debug code yet."/>
          <div style="opacity:0.7;font-size:0.8em;line-height:1;">Give this code to a developer upon request for live assistance.</div>
        </div>
        <!-- We'll add this to the frontend when we switch to sockets, since
          there's no easy way of telling what level the debugger might be using. -->
        <!-- <div class="input-group">
          <div>Logging Level</div>
          <input type="text" readonly id="logging_level" placeholder="error"/>
        </div> -->
      </div>
      <div style="color: #666; font-size: 12px; text-align: center">
        <div id="update-available" class="hidden">
          New version of Mechvibes is available (<span id="new-version">-</span>)
          <div style="margin-top: 5px">
            <a href="https://mechvibes.com" class="open-in-browser">Check it out</a>
          </div>
        </div>
      </div>
    </div>
  </body>
  <!-- <script src="./debug.js"></script> -->
</html>
